<template lang="html">
  <scrm-scroller
    ref="scroller"
    @load="refresh"
    :fixer="this.fixer"
    :topRefs="this.topRefs"
    :bottomRefs="this.bottomRefs"
    @hideFixer = "$emit('hideFixer')"
    @showFixer = "$emit('showFixer')"
    :isHideFixer = "true"
    :loading="loading"
  >
    <div class="rela-tip-main sales-order-tip">
      <div class="rela-result-tip top-list-counter">签约共{{ total }}个</div>
    </div>

    <div class="no-data-tip" v-if="!Object.keys(list).length && init">暂无订单</div>
    <div class="new-new-sign-box">
      <new-sign-item v-for="(custom, index) in list"
      :key="index"
      :value="custom">

      </new-sign-item>
    </div>
  </scrm-scroller>
</template>

<script>
import { mapActions, mapState } from 'vuex'
import ScrmScroller from '../../components/scrm-scroller'
import crmTabbar from '../../components/crm-tabbar'
import customItem from '../../components/custom-item'
import newSignItem from '../../components/new-sign-item'

export default {
  props: {
    topRefs: {
      type: Array
    },
    bottomRefs: {
      type: Array
    },
    fixer: {
      type: HTMLDivElement | Object
    },

  },
  data () {
    return  {
      loading: true,
      winHeight: '',
      page_index: 1,
      params: {
        time: '',
        flag_id: '',
        type: '',
      },
      init: false,
      page_size: 30,
      loading: false,
      show: true,
      hasMoreData: true,
      list: [],
      total: 0,
      customId: '',
    }
  },
  components: {
    ScrmScroller,
    customItem,
    newSignItem
  },
  mounted () {
    this.initParams()
    this.loadSalesOrder()
  },
  methods: {
    refresh () {

    },
    showFixer () {
      this.$refs.scroller.showFixer()
    },
    hideFixer () {
      this.$refs.scroller.hideFixer()
    },
    initParams () {
      const query = this.$route.query
      this.params = {
        custom_id: query.custom_id
      }
    },
    getTimestamp(dateObject) {
      let currentYear = dateObject.getFullYear()
      let currentMonth = dateObject.getMonth()
      let currentMonthDate = new Date(currentYear, currentMonth)
      return Math.floor(currentMonthDate.getTime() / 1000)
    },
    loadSalesOrder () {
      console.log(this.hasMoreData, 'this.hasMoreData')
      if (this.hasMoreData === false) {
        this.loading = true
        return
      }

      let promise
      if (this.loading === true) return

      // promise = this.getCustomOrderList({page_index: this.page_index, page_size: this.page_size})
      promise = this.getCustomOrderList(this.params)
      this.loading = true
      this.init = false

      promise.then((response) => {
        this.init = true
        if (response.data.errcode === 0) {
          this.list = response.data.results
          this.hasMoreData = false
          this.total = Object.keys(this.list).length

          // this.page_index++
          // const totalPage = Math.ceil(parseInt(response.data.total) / parseInt(this.page_size))
          // this.hasMoreData = this.page_index < totalPage
          // console.log(this.page_index < totalPage, this.page_index, totalPage)
          // this.total = response.data.total
        } else {
          this.hasMoreData = false
        }
        this.loading = false
      }).catch((e) => {
        this.init = true
        this.hasMoreData = false
        this.loading = false
        console.log(e)
      })
    },
    reset () {
      this.hasMoreData = true
      this.loading = false
      this.list = []
      this.show = false
      this.total = 0
      this.page_index = 1
      this.false = true
      this.callJsApi('biz.navigation.setTitle', { title: '我的新增客户' })

      setTimeout(() => {
        this.show = true
      })
    },
    jumpTo (cst) {

    },
    caculateScroller () {
      this.winHeight = window.innerHeight - 52
    },
    ...mapActions({
      'getCustomOrderList': 'getCustomOrderList',
      'getCatcstList': 'getCatcstList',
      'changeReadStatus': 'changeReadStatus',
      'getMsgCount': 'getMsgCount',
    })
  },
  computed: {
    ...mapState({
      fullPath: state => state.route.fullPath,
      isAppMode: state => state.config.isAppMode,
      msgCount: state => state.msg.msgCount,
      windowSize: state => state.app.windowSize
    })
  }
}
</script>

<style lang="less">
.sales-order-tip {
  margin: 10px 0;
}
</style>
